<template>
	<view class="content">
		<downloadPop :file_path="file_path"></downloadPop>
		<view class="section-0">
			<view class="section-body">
				<view class="problem-wrapper" v-show="list.length < 1">
					<image src="https://www.mescroll.com/img/mescroll-empty.png"></image>
					<view class="">~ 空空如也 ~</view>
				</view>
				<view class="" v-for="(item, index) in list" :key="index">
					<view class="item">
						<view class="title">文件编号</view>
						<view class="name">
							<view class="text">
								{{ item.file_no }}
							</view>
						</view>
					</view>
					<view class="item">
						<view class="title">发文时间</view>
						<view class="name">
							<view class="text">
								{{ item.project_kyps_time ? item.project_kyps_time.substring(0, 10) : '-' }}
							</view>
						</view>
					</view>
					<view class="item">
						<view class="title">总估算</view>
						<view class="name">
							<view class="text">
								{{ item.total_sum }}
							</view>
						</view>
					</view>
					<view class="item">
						<view class="title">附件</view>
						<view class="name">
							<u-button type="primary" class="button" @click="handleDownLoad(item.file_path)">附件下载</u-button>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import { reportApi } from '@/api/project_manage.js'
import { krpsApi, xmhApi, yearPlanApi } from '@/api/center.js'
import { mapGetters } from 'vuex'
import downloadPop from '@/components/download_pop/index.vue'
export default {
	components: { downloadPop },
	data() {
		return {
			file_path: '',
			type: 1,
			list: [],
			// checkList: [],
			memo: ''
		}
	},
	computed: {
		...mapGetters({
			curProject: 'system/getCurProject'
		})
	},
	methods: {
		handleDownLoad(url) {
			this.file_path = ''
			setTimeout(() => {
				this.file_path = url
			}, 0)
		}
		// handleCheck(id) {
		// 	const idx = this.checkList.indexOf(id);
		// 	if (idx === -1) {
		// 		this.checkList.push(id);
		// 	} else {
		// 		this.checkList.splice(idx, 1);
		// 	}
		// }
	},
	async onReady() {
		krpsApi({ project_id: this.curProject.id }).then(obj => {
			let data = obj.data.data
			data = data.data || {}
			this.list = data
		})
	}
}
</script>

<style lang="scss" scoped>
.custom-button {
	margin-top: 70rpx;
	box-shadow: 0rpx 13rpx 35rpx 0rpx rgba(60, 90, 214, 0.42);
}

.section-0 {
	width: 100%;
	background-color: #3a5df5;

	.section-body {
		padding-top: 50rpx;
		box-sizing: border-box;
		width: 100%;
		padding-left: 40rpx;
		padding-right: 40rpx;
		padding-bottom: 50rpx;
		background-color: #fff;
		background-size: cover;
		background-repeat: no-repeat;
		border-top-left-radius: 50rpx;
		border-top-right-radius: 50rpx;
		.item {
			margin-bottom: 65rpx;
			width: 100%;
			padding-bottom: 10rpx;
			background-color: #ffffff;
			border-radius: 35rpx;
			box-shadow: 0 0 20rpx 10rpx rgba(#bcbcb5, 0.17);
			margin-bottom: 28rpx;

			.title {
				width: 533rpx;
				height: 50rpx;
				padding-top: 15rpx;
				line-height: 50rpx;
				border-bottom: solid 3rpx #f2f2f0;
				font-size: 26rpx;
				font-weight: normal;
				font-stretch: normal;
				letter-spacing: 0rpx;
				color: #8497ac;
				margin-left: 35rpx;
			}
			.name {
				font-size: 26rpx;
				box-sizing: border-box;
				padding: 0 35rpx;
				width: 100%;
				@include clear();
				.text {
					width: 520rpx;
					height: 80rpx;
					line-height: 80rpx;
					font-size: 26rpx;
					font-weight: normal;
					font-stretch: normal;
					letter-spacing: 0rpx;
					color: #46464a;
					float: left;
					text-overflow: ellipsis;
					overflow: hidden;
					font-weight: bold;
					white-space: nowrap;
				}
				.button {
					margin: 20rpx auto;
					font-size: 26rpx;
					width: 180rpx;
					height: 60rpx;
				}
			}
		}
	}
	.problem-wrapper {
		color: #808080;
		margin: 0 auto;
		text-align: center;
		image {
			margin-top: 300rpx;
			width: 200rpx;
			height: 200rpx;
		}
	}
}
</style>
